<!--
 * @Descripttion: 
 * @Version: 
 * @Author: gaohj
 * @Date: 2023-01-04 16:03:22
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2023-01-04 16:39:54
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 数组去重
        var ages = [3, 10, 18, 20, 20, 20, 20, 30, 40, 40, 10, 3, 50, 60, 70, 80, 90, 100];
        

        // 方案1 
        // 准备一个空数组 
        // 遍历原数组
        // 判断新数组中是否有这个元素 没有才往新数组中添加 


        // var newAges = [];
        // for (var i = 0; i < ages.length; i++) {
        //     if (newAges.indexOf(ages[i]) == -1) {
        //         newAges.push(ages[i]);
        //     }
        // }
        // console.log(newAges);

        // 方案2

        // 先排序 
        // 挨个遍历 前后比较 如果两个一样 删除一个  
        // 一直到最后一个元素
        
        // 排序 
        // ages.sort(function(a,b){
        //     return a-b;
        // });

        // // 遍历排序后的数组
        // for(var i=0;i<ages.length;i++){
        //     if(ages[i] == ages[i+1]){
        //         ages.splice(i,1); // 下一个元素补到前一个元素的位置
        //         // 索引一直往后走  
        //         // 保证每个元素都能被遍历到
        //         i--;
        //     }
        // }

        // console.log(ages);

        // 方案3
        // 直接遍历 不排序 
        // 从当前元素开始往后找 如果有相同的就删除
        // 数组.indexOf(元素,开始查找的位置)
        // for(var i=0;i<ages.length;i++){
        //     var index = ages.indexOf(ages[i],i+1); 
        //     // 从当前元素的下一个位置开始查找 直到最后 
        //     // 查看是否有相同的元素
        //     if(index != -1){
        //         ages.splice(index,1); // 如果有相同的元素 就删除
        //         i--;
        //     }
        // }
        // console.log(ages);

        // 方案4

        // 新的数据结构   集合 Set 

        // 集合的数据特点:
        // 1. 无序的
        // 2. 没有重复的元素 每个元素只能出现一次
        // 3  长的像数组 但是不是数组 


        // 数组转集合语法: new Set([数据1,数据2,数据3,...,数据n])

        // 集合 => 数组 

        // 语法1: Array.from(集合);
        // 语法2: 使用展开运算符 ... 例子  [... 集合]

        // var myset = new Set(ages); // 数组转集合
        // var arr2 = Array.from(myset); // 语法1 集合转数组

        // var arr3 = [...myset]; // 语法2 集合转数组

        // console.log(arr2);
        // console.log(arr3);


        // ... 运算符 
        // 1. 展开运算符 可以展开可迭代对象 
        // 什么是可迭代对象:
        // 只要支持遍历的对象都是可迭代对象

        // var newAges = [...ages];
        // console.log(newAges);

        
        
    </script>
</body>

</html>